<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        #msg_con{
            border: solid 1px;
            height: 29rem;
            margin-top: 1rem;
            overflow: scroll;
        }
        .msg_de{
            width: 100%;
            margin-left: 1rem;
        }
    </style>
</head>
<body>
<div>
    <div id="msg_con">

    </div>

    <div id="input-box">
        <input type="text" id="input-text" placeholder="请输入消息">
        <button id="send-btn">发送消息</button>
    </div>
</body>

{include file="public/footer" /}

<script>
    var fuid = "{$fuid}";

    function getMsgList(){
        // ws = new WebSocket("ws://8.130.18.175:9501");
        // let uid = localStorage.getItem('uid');
        // ws.send(JSON.stringify({uid:uid,fuid:fuid,type:"getMsg"}));









        let storename = 'chatMsgNew';
        let uid = localStorage.getItem('uid');

        let request =  window.indexedDB.open('jhx',2);

        //数据库打开成功的回调
        request.onsuccess = function (event){
            let uid = localStorage.getItem('uid');
            db = event.target.result; //数据库对象
            cursorGetDataByIndex(db,storename,'relationid',uid+"-"+fuid);
            db.close();
        }

        //数据库打开失败的回调-
        request.onerror = function (event) {
            console.log('数据库打开失败');
        }

        //数据库有更新时的回调
        request.onupgradeneeded = function (event) {
            //数据库创建或者升级会触发
            console.log('onupgradeneeded');
            db =  event.target.result; //数据库对象
            //创建存储库
            objectStore = db.createObjectStore(storename,{
                keyPath:"id", //主键
                autoIncrement:true //自增
            })
            //创建索引，查询数据时可以使用索引进行查询
            objectStore.createIndex('msg','msg',{unique:false});
            objectStore.createIndex('uid','uid',{unique:false});
            objectStore.createIndex('relationid','relationid',{unique:false});
            objectStore.createIndex('username','username',{unique:false});
            objectStore.createIndex('ctime','ctime',{unique:false});
            objectStore.createIndex('roomid','roomid',{unique:false});
        }
    }

    $(function(){
        getMsgList();
    });

    $("#send-btn").click(function () {
        let msg = $("#input-text").val();
        let uid = localStorage.getItem('uid');
        ws.send(JSON.stringify({msg:msg,uid:uid,fuid:fuid,type:"msg"}));
        $("#input-text").val('');
    });
</script>
</html>